<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html ng-app="LeaderboardApp">
<head>
<meta charset="UTF-8">
<title>Consulta de Puntos Acumulados por Sucursal</title>
<link href="/Leaderboard/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<link href="/Leaderboard/css/bootstrap-theme.min.css" rel="stylesheet" type="text/css"/>
<link href="/Leaderboard/css/select2.css" rel="stylesheet" type="text/css"/>
<link href="/Leaderboard/css/select2-bootstrap.css" rel="stylesheet" type="text/css"/>
<link href="/Leaderboard/css/styles.css" rel="stylesheet" type="text/css"/>

<script type="text/javascript" src="/Leaderboard/js/lib/bootstrap/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="/Leaderboard/js/lib/bootstrap/respond.min.js"></script>
<script type="text/javascript" src="/Leaderboard/js/lib/bootstrap/bootstrap.min.js"></script>

<!--[if lt IE 9]><script type="text/javascript" src="/Leaderboard/js/lib/angularjs/html5shiv-printshiv.min.js"></script><![endif]-->
<!--[if lt IE 8]><script type="text/javascript" src="/Leaderboard/js/lib/angularjs/json3.min.js"></script><![endif]-->

<script type="text/javascript" src="/Leaderboard/js/lib/select2.min.js"></script>
<script type="text/javascript" src="/Leaderboard/js/lib/angularjs/angularjs-1.2.16.min.js"></script>
<script type="text/javascript" src="/Leaderboard/js/controllers.init.js"></script>
<script type="text/javascript" src="/Leaderboard/js/controllers.admin.js"></script>
<script type="text/javascript"src="/Leaderboard/js/controllers.puntosAcumulados.js"></script>

<!--[if lte IE 8]>
<script type="text/javascript">
    $(document).ready(function() {
        angular.bootstrap(document);
    });
</script>
<![endif]-->
</head>
<body>
	<div ng-include="'/Leaderboard/include/header.html'"></div>
	
	<div class="container">
		<div ng-include="'/Leaderboard/include/changePassword.html'"></div>
		
		<div ng-controller="puntosAcumuladosCtrl" ng-init="getBranches()">
			<div ng-include="'/Leaderboard/include/messages.html'"></div>
			
			<div class="panel panel-primary">
				<div class="panel-heading"><h3 class="panel-title">Consulta de Puntos Acumulados por Sucursal</h3></div>
				<div class="panel-body">
					
					<div class="span12 centered-pills">
						<ul class="nav nav-pills">
							<li ng-class="classForMes(mes)" ng-repeat="mes in mesesPuntos"><a ng-click="setCurrentMes(mes); getTotalPuntosUsuarios();" href="javascript:void(0);">{{mes.label}}</a></li>
						</ul>
					</div>
					
					<form role="form" class="form-horizontal">
						<div class="form-group" ng-hide="showDetalleUsuario">
							<label class="col-sm-3 control-label">Seleccionar sucursal</label>
							<div class="col-sm-6">
								<select ng-change="getTotalPuntosUsuarios()" ng-options="branch.name for branch in branches" ng-model="branch" class="form-control ng-pristine ng-valid" name="branches" id="cmbBranches"></select>
							</div>
						</div>
					</form>
				
					<table id="tblPuntosSucursal" class="table table-condensed table-bordered" ng-table="tableParams" ng-hide="mostrarDetalle">
						<thead><tr><th>Mes</th><th>Sucursal</th><th>Empleado</th><th>Puntos por ventas</th><th>Bono por metas</th><th>Total general</th><th>Acciones</th></tr></thead>
						<tbody>
							<tr ng-repeat="puntosUsr in puntosUsuarios">
								<td>{{puntosUsr.fecha}}</td><td>{{puntosUsr.branchName}}</td><td>{{puntosUsr.name}}</td>
								<td>{{puntosUsr.totalPoints}}</td><td>{{puntosUsr.totalBonuses}} ({{puntosUsr.totalMetas}} metas)</td><td class="info"><b>{{puntosUsr.totalGeneral}}</b></td>
								<td>
									<a class="link float-left" href="javascript:void(0);" ng-click="getPuntosAcumuladosUsuario(puntosUsr.userId)">Ver detalle</a>
								</td>
							</tr>
						</tbody>
					</table>
					
					<table id="tblPuntosUsuario" class="table table-condensed table-bordered" ng-table="tableParamsDetalle" = ng-show="mostrarDetalle">
						<thead><tr><th>Mes</th><th>Meta</th><th>Puntos</th></tr></thead>
						<tbody>
							<tr ng-repeat="punto in puntos">
								<td>{{punto.fecha}}</td><td>{{punto.meta}}</td><td>{{punto.puntos}}</td>
							</tr>
							<tr class="info"><td colspan="2">Total Puntos Ventas</td>
								<td><span>{{totalPuntos}}</span></td>
							</tr>
							<tr>
								<td>{{mesSeleccionado.label}}</td>
								<td>Puntos bono por {{totalMetas}} metas completadas</td>
								<td>{{totalPuntosBono}}</td>
							</tr>
							<tr class="info"><td colspan="2"><h4>Total General</h4></td>
								<td><h4>{{totalGeneral}}</h4></td>
							</tr>
						</tbody>
					</table>
				</div>
				<div class="panel-footer">
					<button type="button" class="btn btn-default" ng-click="getTotalPuntosUsuarios()">Refrescar</button>
					<button type="button" class="btn btn-primary" ng-click="backToTotales()" ng-show="mostrarDetalle">Regresar</button>
				</div>
			</div>
			
		</div>
	</div>
</body>
</html>